<template>
	<slide-page-right-tab 
		title="测评结果"
		class="practise-result">
		<div class="practise-result-content">
			此次发音测试的质量值：<p class="result-text">{{ result }}</p>
			<br />
			<p style="font-size: 1.2rem;">测试详情</p>
			<br />
			<glass-table 
				:headers="tableHeaders"
				:data="score">
			</glass-table>
		</div>
	</slide-page-right-tab>
</template>

<script>
	import slidePageRightTab from '../../components/slide-page-right/slide-page-right-tab.vue'
	import GlobalData from '../../common/global.js'
	import VoiceCorrect from '../../common/voiceCorrect.js'
    export default {
		components: {
			slidePageRightTab,
		},
        data() {
            return {
				score: [],
				tableHeaders: ['序号', '练习文字', '读出文字', '声调', '韵母', '声母'],
				result: 0.0,
            }
        },
		methods: {
			getVoiceScore() {
				const rawWords = GlobalData.trainWords
				const reqResultWords = GlobalData.reqResults
				const wordsNum = rawWords.length
				let result = 0
				const u = 0.2
				
				for(let i=0;i<wordsNum;++i) {
					const rawWord = rawWords[i]
						, userWord = reqResultWords[i]
					// if(!userWord) continue
					const userWordCharacter = this.getTransCharacters('你')
					const rawWordCharacter = this.getTransCharacters(rawWord)
					const voiceCorrect = new VoiceCorrect(rawWordCharacter, userWordCharacter)
					const toneScore = voiceCorrect.toneAnalyse()
						, finalScore = voiceCorrect.finalsAnalyse()
						, consonantScore = voiceCorrect.consonantAnalyse()
					// 计算得分
					result += (toneScore*u+finalScore+consonantScore) / (2+u)
					
					this.score.push({
						index: i+1,
						rawWord,
						userWord,
						toneScore,
						finalScore,
						consonantScore,
					})
				}
				this.result = ((result / wordsNum) * 100).toFixed(1)
			},
			getTransCharacters(word) {
				const pinyin = require('pinyin-pro').pinyin
				word = word.length === 1 ? word : word[0]
				const initial = pinyin(word, { pattern: 'initial' })
				const final = pinyin(word, { pattern: 'final', toneType: 'none' })
				const num = pinyin(word, { pattern: 'num' })
				return [initial, final, num]
			}
		},
		mounted() {
			this.getVoiceScore()
		}
		
    }
</script>

<style lang="scss" scoped>
	.practise-result {
		width: 65%;
		&-content {
			display: flex;
			flex-direction: column;
			padding-bottom: 50px;
		}
	}
	.result-text {
		color: #0081ff;
		font-size: 2rem;
		font-weight: bold;
	}
	
</style>


